<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JSON对象</title>
    <script>
        function f1(){
            let user = {"id":1,"username":"admin","password":"123456"};
            console.log(user);
            console.log(typeof user);
            // 在JSON中,可以通过对象.属性的方式操作对应的数据
            // 相当于Java中的get/set方法
            user.id = 2;
            console.log(user);
            console.log(user.username);
            // 还支持对象["属性名"]或者对象['属性名']的方式操作属性
            user['username'] = "alice";
            user["password"] = "111111";
            console.log(user["username"]);
            console.log(user['password']);
        }

        function f2(){
            let dept = {"id":2,"name":"研发部"};
            let emp = {"id":1,"name":"admin","dept":dept};
            console.log(emp.id);
            console.log(emp["name"]);
            console.log(emp.dept.id);
            console.log(emp.dept["id"]);
            console.log(emp['dept']["id"]);
            // 在正式开发中,建议使用统一的用法,不要混用
            // 一般使用对象.属性的方式进行操作
        }

        function f3(){
            let users = [{
                "id":1,
                "username":"admin",
                "password":"123456"
            },{
                "id":2,
                "username":"alice",
                "password":"111111"
            },{
                "id":3,
                "username":"jack",
                "password":"222222"
            },{
                "id":4,
                "username":"tom",
                "password":"333333"
            }];
            for(let i = 0; i < users.length; i++){
                console.log(users[i].id+"--"+users[i].username+"--"+users[i].password);
            }
        }
    </script>
</head>
<body>
<button onclick="f1()">基本语法</button><br>
<button onclick="f2()">对象中包含对象</button><br>
<button onclick="f3()">对象数组</button><br>
</body>
</html>